<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="../common/path.jsp" %>
<html>

<head>
    <title>记点滴微信平台</title>
    <%@include file="../common/wechatcss.jsp" %>
    <style>
        img {
            min-height: 100px;
            min-width: 100px;
        }
    </style>
</head>

<body ms-controller="commonController" style="background-color: #FFFFFF;">
<div id="commenlist">

    <div style="height:120px;background-color: #5DADE2">
        <p style="color: #ffffff;font-size: 20px;">讨论热门话题</p>
        <h3 style="color: #ffffff;margin-left: 100px;font-size:40px;line-height: 10px;font-weight: lighter">
            话题</h3><span
            style="float: right;font-size: 0.7em;margin-right: 20px;color: #ffffff;line-height: 5px;">寻找美女朋友</span>
    </div>
    <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media" ms-for="el in @topiclist" ms-click="@topicDetil(el)">
            <a href="javascript:;">
                <img class="mui-media-object mui-pull-left" src="<%= path%>/images/yuantiao.jpg">
                <div class="mui-media-body">
                    <h2 style="margin-left: 10px;margin-top: 0px;color: #bd192e"><span
                            style="margin-left: 10px;margin-right: 20px;margin-top: 5px;font-size: 0.5em;color: #000">{{el.title}}</span>
                    </h2>
                    <strong style="margin-left: 10px;margin-right: 20px;margin-top: 5px;font-size: 0.8em;"></strong>
                    <p class='mui-ellipsis' style="margin-left: 0px;font-size: 0.8em;float: left;line-height:50px;">
                        {{el.content}}</p>
                </div>
            </a>
        </li>


    </ul>
</div>
<div class="col-md-12">
    <div id="detail">
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" ms-click="@back()"></a>
            <h1 class="mui-title">话题详情</h1>
        </header>
        <div class="flex-container" style="margin-top: 50px;">
            <div class="mui-content-padded" align="center">
                <h4><span style="color: #ff6218">{{@topic.title}}<span></h4>
            </div>
        </div>
        <div style="margin-right: 20px;margin-left: 20px;">
            <p>{{@topic.content}}</p>
        </div>
        <div class="title">
            <strong>评论</strong>
        </div>
        <ul id="list" class="mui-table-view mui-table-view-chevron">

            <li class="mui-table-view-cell" ms-for="el in @commenlist">
                <span>游客:{{el.content}}</span>
            </li>
        </ul>
        <div style="margin-top: 20px;">
            <div class="mui-input-row mui-search" style="width: 80%;float: left;height: 50px;">
                <input type="text" placeholder="评语" ms-duplex="@commenstring">
            </div>
            <div class="mui-btn mui-btn-primary" style="width: 20%;float: left;height: 40px;" ms-click="@comment()">
                确定
            </div>
        </div>
    </div>
</div>


</body>


<%@include file="../common/wechatjs.jsp" %>
<script src="<%=path%>/myjs/wechat/commenlist.js"></script>
</html>